<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core">

    <body>

        <ui:composition template="./plantillas/plantillaGeneral.xhtml">
            <ui:define name="titulo">
                Demo EJB+JPA+JSF :: Detalle de producto
            </ui:define>

            <ui:define name="encabezado">
                <ui:include src="./plantillas/vistaCabecera.xhtml"/>
            </ui:define>

            <ui:define name="izquierda">
                <ui:include src="./plantillas/vistaIzquierda.xhtml"/>
            </ui:define>

            <ui:define name="contenido">
                <h:panelGroup styleClass="panelDatos">
                    <h3> <h:outputText value="Detalle del producto"/> </h3>

                    <h:panelGrid frame="box" border="1" columns="2">

          <h:form>
              <h:dataTable value="#{catalogoController.lista}" binding="#{catalogoController.tabla}" var="lis">         
            <h:column>
              <f:facet name="header">
                <h:outputText value="DESCRIPCION"/>
              </f:facet>
                <h:outputText value="#{lis.descripcion}"/>
            </h:column>
            <h:column>
              <f:facet name="header">
                <h:outputText value="DETALLE"/>
              </f:facet>
                <h:outputText value="#{lis.detalle}"/>
            </h:column>
            <h:column>
              <f:facet name="header">
                <h:outputText value="PRECIO"/>
              </f:facet>
                <h:outputText value="#{lis.precio}"/>
            </h:column>
            <h:column>
              <f:facet name="header">
                <h:outputText value="EXISTENCIAS"/>
              </f:facet>
                <h:outputText value="#{lis.existencias}"/>
            </h:column>
                  <h:column>
              <f:facet name="header">
                <h:outputText value="MARCA"/>
              </f:facet>
                      <h:outputText value="#{lis.marca}"/>
            </h:column>
                  <h:column>
              <f:facet name="header">
                <h:outputText value="MODELO"/>
              </f:facet>
                      <h:outputText value="#{lis.modelo}"/>
            </h:column>
            <h:column>
             <f:facet name="header">
              <h:outputText value="SELECCIONAR"/>
             </f:facet>
                <h:commandLink action="#{catalogoController.seleccionLista}">
                SELECCION
              </h:commandLink>               
            </h:column>                  
          </h:dataTable>              
      </h:form>

       <h:form>
    
      <h:outputLabel for="descripcion"> descripcion </h:outputLabel>
      <h:inputText onfocus="this.value=''" id="descripcion" value="#{catalogoController.descripcion}"></h:inputText><br></br>
      <h:outputLabel for="detalle"> detalle </h:outputLabel>
      <h:inputText onfocus="this.value=''" id="detalle" value="#{catalogoController.detalle}"></h:inputText><br></br>
      <h:outputLabel for="precio"> precio </h:outputLabel>
      <h:inputText onfocus="this.value=''" id="precio" value="#{catalogoController.precio}"></h:inputText><br></br>
      <h:outputLabel for="existencias"> existencias </h:outputLabel>
      <h:inputText onfocus="this.value=''" id="existencias" value="#{catalogoController.existencias}"></h:inputText><br></br>
      <h:outputLabel for="marca"> marca </h:outputLabel>
      <h:inputText onfocus="this.value=''" id="marca" value="#{catalogoController.marca}"></h:inputText><br></br>
      <h:outputLabel for="modelo"> modelo </h:outputLabel>
      <h:inputText onfocus="this.value=''" id="modelo" value="#{catalogoController.modelo}"></h:inputText><br></br>
      <h:graphicImage id="image" value="#{catalogoController.theImage}"/>
      <h:commandButton value="Agregar" action="#{catalogoController.cargarLista}"></h:commandButton>
      
      </h:form>

                    </h:panelGrid>
                </h:panelGroup>

                <h:commandButton value="Volver" immediate="true" onclick="history.back()"/>             
            </ui:define>

        </ui:composition>

    </body>
</html>
